<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('电子箱单明细')"/>
    <link th:href="@{/assets/libs/layui/css/layui.css}" media="all" rel="stylesheet">
    <style>
        [v-cloak] {
            display: none;
        }
        .pagination{
            text-align: right;
            width: 100%;
            margin-bottom: 0;
        }
    </style>
</head>
<body class="gray-bg">
<div class="container-div">
    <div class="row">
        <div class="col-sm-12 search-collapse">
            <form id="formId">
                <div class="select-list">
                    <ul>
                        <li class="select-time">
                            <label>出库日期：</label>
                            <input type="text" class="time-input" id="startTime" placeholder="开始时间" name="startTime"/>
                            <span>-</span>
                            <input type="text" class="time-input" id="endTime" placeholder="结束时间" name="endTime"/>
                        </li>
                        <li class="select-time">
                            <label>创建日期：</label>
                            <input type="text" class="time-input" id="startTime1" placeholder="开始时间" name="startTime1"/>
                            <span>-</span>
                            <input type="text" class="time-input" id="endTime1" placeholder="结束时间" name="endTime1"/>
                        </li>
                        <li v-if="checkedSearch.indexOf('SAP交货单号') != -1">
                            SAP交货单号：<input type="text" name="Conductive"/>
                        </li>
                        <li v-if="checkedSearch.indexOf('托号') != -1">
                            托号：<input type="text" name="Torr"/>
                        </li>
                        <li v-if="checkedSearch.indexOf('批次号') != -1">
                            批次号：<input type="text" name="f_Degree"/>
                        </li>
                        <li v-if="checkedSearch.indexOf('物料编码') != -1">
                            物料编码：<input type="text" name="BarCode"/>
                        </li>
                        <!--<li v-if="checkedSearch.indexOf('厂商名称') != -1">
                            厂商名称 ：<input type="text" name="Firm"/>
                        </li>-->
                        <li>
                            厂商名称：
                            <input id="createUserName" name="Firm" v-model="checkCreateUserName" @click="getName" readonly/>
<!--                            <el-select multiple collapse-tags v-model="checkCreateUserList" @change="changeSelect" placeholder="请选择产商">-->
<!--                                <el-checkbox v-model="allCheckCreateUser" @change="selectAll" style="margin-left: 10px;padding: 5px 0">全选</el-checkbox>-->
<!--                                <el-option v-for="(item, index) in users" :key="index" :label="item" :value="item"></el-option>-->
<!--                            </el-select>-->
                        </li>
                        <li v-if="checkedSearch.indexOf('单晶编码') != -1">
                            单晶编码 ：<input type="text" name="coding"/>
                        </li>
                        <li v-if="checkedSearch.indexOf('入库类别') != -1">
                            入库类别：
                            <select name="InType">
                                <option value="">全部</option>
                                <option value="正常">正常</option>
                                <option value="二类">二类</option>
                                <option value="三类">三类</option>
                            </select>
                        </li>
                        <li>
                            <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i
                                    class="fa fa-search"></i>&nbsp;搜索</a>
                            <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()" @click="myReset()"><i
                                    class="fa fa-refresh"></i>&nbsp;重置</a>
                            <!--<a class="btn btn-success btn-rounded btn-sm" @click="moreSearch()"><i class="fa fa-edit"></i>&nbsp;更多</a>-->
                        </li>
                    </ul>
                </div>
            </form>
        </div>
        <el-dialog title="搜索条件" width="200px" :visible.sync="showMore">
            <el-row>
                <el-col :span="24">
                    <el-checkbox style="margin-left: 28px" :indeterminate="isIndeterminate" v-model="checkAll"
                                 @change="handleCheckAllChange">全选
                    </el-checkbox>
                    <el-checkbox-group v-model="checkedSearch" @change="handleCheckedSearchChange">
                        <el-checkbox style="display: block;margin-left: 28px" v-for="item in searches" :label="item"
                                     :key="item" v-cloak>{{item}}
                        </el-checkbox>
                    </el-checkbox-group>
                </el-col>
            </el-row>
        </el-dialog>
        <el-dialog title="选择厂商名称" :visible.sync="nameModel" :before-close="handleClose">
            <el-form :inline="true" :model="formInline" class="demo-form-inline">
                <el-form-item label="厂商名称">
                    <el-input clearable v-model="formInline.supplierName" @clear="searchList" placeholder="厂商名称"></el-input>
                </el-form-item>
                <el-button type="primary" icon="el-icon-search" @click="searchList">搜索</el-button>
            </el-form>
            <el-table :data="nameData" border style="width: 100%" @selection-change="handleSelectionChange">
                <el-table-column type="selection" width="55">
                </el-table-column>
                <el-table-column
                        type="index"
                        label="序号"
                        width="50">
                </el-table-column>
                <el-table-column prop="supplierName" label="厂商名称"></el-table-column>
            </el-table>
            <div class="pagination">
                <el-pagination layout="prev, pager, next" background :total="total" :current-page="pageNum" @current-change="handleCurrentChange">
                </el-pagination>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="handleClose">取 消</el-button>
                <el-button type="primary" @click="setName">确 定</el-button>
            </span>
        </el-dialog>
        <div class="btn-group-sm" id="toolbar" role="group">
            <!--//导出全部 功能会造成内存溢出，不要使用-->

            <a class="btn btn-info" onclick="$.table.importExcel()">
                <i class="fa fa-upload"></i> 导入
            </a>

            <a class="btn btn-warning" @click="partExcel()" shiro:hasPermission="electricBox:partExcel">
                <i class="fa fa-download"></i> 部分导出
            </a>

            <a class="btn btn-primary" @click="bit()">
                <i class="fa fa-print"></i> 打印
            </a>
        </div>
        <div class="col-sm-12 select-table table-striped">
            <table id="bootstrap-table" data-mobile-responsive="true" style="white-space: nowrap"></table>
        </div>
    </div>
</div>
<div th:include="include :: footer"></div>
<script th:src="@{/wms/js/moreSearch.js}"></script>
<script th:inline="javascript">
    var prefix = ctx + "electricBox";
    var editFlag = [[${@permission.hasPermi('electricBoxDetail:edit')}]];
    const searchOptions = ['SAP交货单号', '托号', '批次号', '物料编码', '厂商名称', '入库类别', '单晶编码'];

    var app = new Vue({
        el: '.container-div',
        data: {
            multipleSelection: [],
            formInline: {
                supplierName: ''
            },
            nameModel: false,
            showMore: false,
            checkAll: false,
            checkedSearch: ['SAP交货单号', '托号', '批次号', '物料编码', '厂商名称', '入库类别', '单晶编码'],
            searches: searchOptions,
            isIndeterminate: true,
            timeA: '',
            timeB: '',
            users: [],
            checkCreateUserList: [],
            allCheckCreateUser: false,
            checkCreateUserName: '',
            nameData: [
                {name: '111', date: '222', address: '333'},
                {name: '111', date: '222', address: '333'}
            ],
            total: 0,
            pageNum: 1
        },
        methods: {
            // 分页
            handleCurrentChange(val) {
                this.pageNum = val;
                this.getUsers();
            },
            handleClose() {
                this.formInline.supplierName = '';
                this.nameModel = false;
                this.pageNum = 1;
            },
            searchList() {
                this.getUsers();
            },
            setName() {
                var arr = [];
                for (let i in this.multipleSelection) {
                    arr.push(this.multipleSelection[i].supplierName);
                }
                this.checkCreateUserName = arr.join();
                this.formInline.supplierName = '';
                this.pageNum = 1;
                this.nameModel = false;
            },
            // 表格复选
            handleSelectionChange(val) {
                this.multipleSelection = val;
            },
            // 获取厂商名称
            getName() {
                this.nameModel = true;
                this.getUsers();
            },
            //获取操作员列表
            getUsers(){
                var that = this;
                $.ajax({
                    cache: true,
                    type: "POST",
                    url: "/electricBox/selectFirm",
                    data: {
                        pageSize: 10,
                        pageNum: this.pageNum,
                        supplierName: this.formInline.supplierName
                    },
                    async: false,
                    error: function(request){
                        $.modal.alertError("系统错误");
                    },
                    success: function(data){
                        that.nameData = data.rows;
                        that.total = data.total;
                    }
                });
            },
            //操作员下拉框全选
            selectAll(){
                this.checkCreateUserList = []
                if(this.allCheckCreateUser){
                    var tmpArr = [];
                    this.users.forEach((item) => {
                        tmpArr.push(item);
                    })
                    this.checkCreateUserList = this.users;
                    this.checkCreateUserName = this.checkCreateUserList.toString();
                }else{
                    this.checkCreateUserList = [];
                    this.checkCreateUserName = '';
                }
            },
            myReset(){
                this.resetCheckCreateUserName();
                this.resetTime();
            },
            //切换操作员全选状态
            changeSelect(val){
                if(val.length == this.users.length) {
                    this.allCheckCreateUser = true;
                }else{
                    this.allCheckCreateUser = false;
                }
                this.checkCreateUserName = this.checkCreateUserList.toString();
            },
            //清空操作员
            resetCheckCreateUserName(){
                this.checkCreateUserList = [];
                this.checkCreateUserName = '';
            },
            //清空时间
            resetTime(){
                this.timeA = '';
                this.timeB = '';
            },
            //部分导出
            partExcel() {
                var rows = $.common.isEmpty($.table._option.uniqueId) ? $.table.selectFirstColumns() : $.table.selectColumns($.table._option.uniqueId);
                if (rows.length == 0) {
                    $.modal.alertWarning("请至少选择一条记录");
                    return;
                } else {
                    $.modal.confirm("确认要导出选中的" + rows.length + "条数据吗?", function () {
                        var url = prefix + "/partExcel";
                        var data = {"ids": rows.join()};
                        $.post(url, data, function (result) {
                            if (result.code == web_status.SUCCESS) {
                                window.location.href = ctx + "common/download?fileName=" + encodeURI(result.msg) + "&delete=" + true;
                            } else if (result.code == web_status.WARNING) {
                                $.modal.alertWarning(result.msg);
                            } else {
                                $.modal.alertError(result.msg);
                            }
                            $.modal.closeLoading();
                        });
                    });
                }
            },
            //打印按钮
            bit() {
                var rows = $.common.isEmpty($.table._option.uniqueId) ? $.table.selectFirstColumns() : $.table.selectColumns($.table._option.uniqueId);
                if (rows.length == 0) {
                    $.modal.alertWarning("请至少选择一条记录");
                    return;
                } else {
                    $.modal.openTab("打印", "http://localhost:8000/electricBox/print?ids=" + rows);
                }
            }
        },
        created(){
            this.getUsers();
        }
    })

    $(function () {
        var options = {
            url: prefix + "/list",
            importUrl: prefix + "/importData",
            exportUrl: prefix + "/export",
            importTemplateUrl: prefix + "/importTemplate",
            modalName: "电子箱单明细",
            columns: [
                {
                    checkbox: true
                },
                {
                    field: 'id',
                    title: 'ID',
                    align: 'center',
                    visible: false
                },
                {
                    title: '操作',
                    align: 'center',
                    formatter: function (value, row, index){
                        var actions = [];
                        actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="#" onclick="$.operate.edit(\'' + row.id + '\')"><i class="fa fa-edit"></i>编辑</a> ');
                        return actions.join('');
                    }
                },
                {
                    field: 'TorrNumber',
                    title: '序号',
                    align: 'center',
                    visible: false
                },
                {
                    field: 'OutData',
                    title: '出库日期',
                    align: 'center'
                },
                {
                    field: 'createTime',
                    title: '创建日期',
                    align: 'center'
                },
                {
                    field: 'Conductive',
                    title: 'SAP交货单号',
                    align: 'center'
                },
                {
                    field: 'Torr',
                    title: '托号',
                    align: 'center'
                },
                {
                    field: 'f_Degree',
                    title: '批次号',
                    align: 'center'
                },
                {
                    field: 'BarCode',
                    title: '物料编码',
                    align: 'center'
                },
                {
                    field: 'Firm',
                    title: '厂商名称',
                    align: 'center'
                },
                {
                    field: 'coding',
                    title: '单晶编码',
                    align: 'center'
                },
                {
                    field: 'workShop',
                    title: '单晶组合',
                    align: 'center'
                },
                {
                    field: 'Size',
                    title: '规格',
                    align: 'center'
                },
                {
                    field: 'R_Long',
                    title: '入库长度',
                    align: 'center'
                },
                {
                    field: 'D_Long',
                    title: '单晶长度',
                    align: 'center'
                },
                {
                    field: 'Weight',
                    title: '重量',
                    align: 'center'
                },
                {
                    field: 'T_Weigh',
                    title: '理论重量',
                    align: 'center'
                },
                {
                    field: 'CustomerProfile',
                    title: '客户类别',
                    align: 'center'
                },
                {
                    title: '棒长范围',
                    align: 'center',
                    formatter: function(value, row, index){
                        return row.minLong + '-' + row.maxLong;
                    }
                },
                {
                    field: 'InType',
                    title: '入库类别',
                    align: 'center'
                },
                {
                    field: 'Remark',
                    title: '方棒备注',
                    align: 'center'
                },
                {
                    field: 'B_Long',
                    title: '崩',
                    align: 'center'
                },
                {
                    field: 'Inclined',
                    title: '斜',
                    align: 'center'
                },
                {
                    field: 'J_Beige',
                    title: '单晶灰皮',
                    align: 'center'
                },
                {
                    field: 'F_Beige',
                    title: '方棒灰皮',
                    align: 'center'
                },
                {
                    field: 'Stria',
                    title: '线痕',
                    align: 'center'
                },
                {
                    field: 'Scar',
                    title: '刀痕',
                    align: 'center'
                },
                {
                    field: 'SizeType',
                    title: '阴阳面',
                    align: 'center'
                },
                {
                    field: 'WagonNumber',
                    title: '水印',
                    align: 'center'
                },
                {
                    field: 'P_Type',
                    title: '平面手感',
                    align: 'center'
                },
                {
                    field: 'VerifyRemark',
                    title: '砂轮印',
                    align: 'center'
                },
                {
                    field: 'Warehousing',
                    title: '外圆手感',
                    align: 'center'
                },
                {
                    field: 'Scratch',
                    title: '划痕',
                    align: 'center'
                },
                {
                    field: 'NotGrind',
                    title: '未磨到',
                    align: 'center'
                },
                {
                    field: 'AbnormalSize',
                    title: '尺寸异常',
                    align: 'center'
                },
                {
                    field: 'D_Location',
                    title: '亮斑',
                    align: 'center'
                },
                {
                    field: 'Passivation_T',
                    title: '棱崩',
                    align: 'center'
                },
                {
                    field: 'Dopant',
                    title: '砂轮亮点',
                    align: 'center'
                },
                {
                    field: 'Flaw',
                    title: '拼缝宽',
                    align: 'center'
                },
                {
                    field: 'LengthInStorage',
                    title: '减异常入库长度',
                    align: 'center'
                },
                {
                    field: 'AbnormalLength',
                    title: '一二三类/放行（异常）长度',
                    align: 'center'
                },
                {
                    field: 'AbnormalLengthTheory',
                    title: '一二三类/放行（异常）理论长度',
                    align: 'center'
                },
                {
                    field: 'TotalLength',
                    title: '合计长度',
                    align: 'center'
                },
                {
                    field: 'TotalWeight',
                    title: '合计理论重量',
                    align: 'center'
                },
                {
                    field: 'remark1',
                    title: '备注1',
                    align: 'center'
                },
                {
                    field: 'remark2',
                    title: '备注2',
                    align: 'center'
                },
                {
                    field: 'remark3',
                    title: '备注3',
                    align: 'center'
                },
                {
                    field: 'remark4',
                    title: '备注4',
                    align: 'center'
                },
                {
                    field: 'remark5',
                    title: '备注5',
                    align: 'center'
                },
            ]
        };
        $.table.init(options);
    });
</script>
<form id="importForm" enctype="multipart/form-data" class="mt20 mb10" hidden="hidden">
    <div class="col-xs-offset-1">
        <input type="file" id="file" name="file"/>
        <p>所有字段为必填项</p>
        <div class="mt10 pt5">
            &nbsp;	<a onclick="$.table.importTemplate()" class="btn btn-default btn-xs"><i class="fa fa-file-excel-o"></i> 下载模板</a>
        </div>
        <font color="red" class="pull-left mt10">
            提示：仅允许导入“xls”或“xlsx”格式文件！
        </font>
    </div>
</form>
</body>
<!-- 导入区域 -->



</html>
